Enabling the Swiper Manipulation Module
If you're using the Product Video module by Smart Modules in a PrestaShop theme that uses Swiper Slider, you might encounter an issue where the video thumbnail fails to appear alongside your product images.
This usually happens when the Manipulation module from Swiper has not been enabled. The module is essential for allowing dynamic elements (like video slides) to be inserted into the slider at runtime.
π§ When Do You Need This?β
You may see an error like this in your browser console:
Uncaught TypeError: slider.addSlide is not a function
This error means that the Swiper slider on your theme is not initialized with the Manipulation
module, which is required by the Product Video module to dynamically add video thumbnails as slides.
The good news? Fixing this only requires a small edit in your theme's Swiper initialization code.
π οΈ Step-by-Step: How to Enable the Manipulation Moduleβ
1. Locate the Swiper Initialization Codeβ
In your theme's files, locate the JavaScript file that initializes the product image slider.
This is typically located in:
/themes/your-theme/assets/js/product.js
/themes/your-theme/js/product.js
/themes/your-theme/js/custom.js
Search for a Swiper setup like this:
var swiper = new Swiper('.swiper-container', {
// your Swiper options
});
2. Add the Manipulation
Moduleβ
Inside the Swiper config, find the modules
property. Add Manipulation
to the list.
Example before:
modules: [Navigation, Pagination],
Update to:
modules: [Navigation, Pagination, Manipulation],
If the modules
property doesnβt exist yet, add it like this:
modules: [Manipulation],
Donβt remove any existing modules β just add Manipulation
to the list.
3. Clear PrestaShop Cacheβ
After saving your changes:
- Go to your Back Office
- Navigate to Advanced Parameters > Performance
- Click Clear Cache
This ensures your updated JavaScript is loaded correctly.
4. Test the Resultβ
Reload any product page with an attached video.
If everything is correct, the video thumbnail will now appear as part of the product image gallery, fully integrated into the Swiper slider.
π Related Linksβ
- Swiper API Documentation β Manipulation Module
- Product Video module by Smart Modules β Addons Marketplace
- Product Video module by Smart Modules β Smart-Modules.com
π¬ Still Need Help?β
If you're unsure where this code is located or how to modify it, feel free to contact our support team. You can also send us the file where the Swiper is initialized, and weβll gladly guide you through the change.
By following these steps, you'll ensure full compatibility between your theme's Swiper slider and the Product Video module by Smart Modules, keeping your video thumbnails working smoothly and avoiding any JavaScript errors.